<template>

  <el-card>
    <el-breadcrumb separator="/">
      <el-breadcrumb-item>公众</el-breadcrumb-item>
      <el-breadcrumb-item>学期课程信息</el-breadcrumb-item>
    </el-breadcrumb>
    <div class="searchForm">

      <el-form :inline="true" class="demo-form-inline">
        <el-form-item>
          <el-input v-model="queryInfo.query" placeholder="请输入课程名称" clearable @clear="getCourseList"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="" @click="getCourseList" icon="el-icon-search">查询</el-button>
        </el-form-item>

      </el-form>
      <el-table :header-cell-style="{background:'#808080',color:'#FFFFFF'}" border stripe :data="List" style="width: 100%">
        <el-table-column prop="cname" label="课程" width="" align="center">
        </el-table-column>
      </el-table>
    </div>

    <div>
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="queryInfo.pageNum"
        :page-sizes="[4]"
        :page-size="queryInfo.pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total">
      </el-pagination>
    </div>
  </el-card>
</template>
<script>
  export default {

    created(){
      this.getCourseList();
      this.getCname();
    },
    data() {
      return {
        queryInfo:{
          query:'',//查询信息
          role:this.$session.get('termname'),
          pageNum:1,
          pageSize:4
        },
        queryInfo1:{
          query:'',//查询信息
          role:'C',
          pageNum:1,
          pageSize:20
        },
        List:[],
        CnameList:[],
        total:0,
        addDialogVisible:false,
        editDialogVisible:false,
        infoDialogVisible:false,

        addForm:{
          cname:'',
          termname:this.$session.get('termname'),
          ords:this.$session.get('ords'),
        },

        addFormRules: {
          cname:[
            { required: true, message:'请选择', trigger: 'blur' },

          ],

        },



      }
    },


    methods: {
      async getCname () {
        const { data: res } = await this.$http.get("Courses/AllCname" ,{ params: this.queryInfo1 });
        this.CnameList = res.data;
      },
      async getCourseList () {
        const { data: res } = await this.$http.get("Publics/AllProfesTermCourse", { params: this.queryInfo })
        this.List = res.data;
        this.total = res.numbers;
      },





      handleSizeChange (newSize) {
        this.queryInfo.pageSize = newSize;
        this.getCourseList();
      },
      handleCurrentChange (newPage) {
        this.queryInfo.pageNum = newPage;
        this.getCourseList();
      },
      addDialogClose () {
        this.$refs.addFormRef.resetFields();
      },
      editDialogClose () {
        this.$refs.editFormRef.resetFields();
      },
    }
  }
</script>




<style scoped>
  .searchForm{
    margin-top: 40px;
  }
</style>

